<template>
  <div class="aa">
    <div class="fanhui">
      <van-icon name="cross" color="#1abc9c" size="30" @click="$router.push('/layout')" />
    </div>

    <div id="denglu">
      <van-cell-group>
        <van-field
          v-model="value1"
          name="extra"
          placeholder="手机号码"
          style="background-color: #f9f9f9;"
        >
        <template #left-icon>
          <div>
            <img src="../../assets/mingpian.png" alt="" class="geshi" style="margin-right: 20px;">
          </div>
        </template>
      </van-field>
        <van-field
          v-model="value2"
          style="background-color: #f9f9f9;"
          left-icon=""
          placeholder="登录密码"
        >
        <template #left-icon>
          <div>
            <img src="../../assets/suo.png" alt="" class="geshi" style="margin-right: 20px;">
          </div>
        </template>
        <template #right-icon>
          <div>
            <van-switch v-model="checked" active-color="#cccccc" inactive-color="#dcdee0" size="20px" />
          </div>
        </template>
      </van-field>
      </van-cell-group>
      <div id="wangji" @click="gowangji">忘记密码</div>
      <van-button type="primary" size="large" style="border-radius: 30px; height: 40px;" color="#1abc9c">登录</van-button>

      <div id="chuangjian" @click="gochuangjian">创建账号</div>
    </div>
  </div>
</template>

<script>
export default {
  name: "",
  mixins: [],
  components: {},
  props: {},
  data() {
    return {
      value1: '',
      value2: '',
      checked: false,
    };
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {},
  methods: {
    gowangji(){
      this.$router.push('/login2')
    },
    gochuangjian(){
      this.$router.push('/login1')
    }
  },
};
</script>

<style scoped lang="less">
.aa {
  background: #f9f9f9;
  height: 100vh;
}
.fanhui {
  text-align: right;
  width: 100vw;
  height: 10vh;
  line-height: 10vh;
  box-sizing: border-box;
  padding: 0 40px;
}
.geshi{
  width: 20px;
  height: 20px;
}
#denglu{
  margin-top:120px ;
  box-sizing: border-box;
  padding: 0 30px;
}

#wangji{
 
  height: 50px;
  text-align: right;
  line-height: 50px;
  font-size: 12px;
  color: #1abc9c;
}
#chuangjian{
 
 height: 60px;
 text-align: center;
 line-height: 60px;
 font-size: 12px;
 color: #1abc9c;
}

</style>
